/**
 * Created by lenovo on 2016/8/14.
 */
window.onload = function(){
    var obth = document.getElementById("modify");
    obth.onclick=function(){
        //获取页面的高度和宽度
        var sHeight = document.documentElement.scrollHeight;
        var sWidth = document.documentElement.scrollWidth;
        //获取页面可视区域
        var wHeight = document.documentElement.clientHeight;
        var wWidth = document.documentElement.clientWidth;
        var oMask = document.createElement("div");
        oMask.id = "mask";
        oMask.style.height = sHeight + "px";
        oMask.style.width = sWidth + "px";
        document.body.appendChild(oMask);
        var con = document.createElement("div");
        con.id = "con";
        con.innerHTML = "<h1>上传头像</h1><hr><form action='upLoad' enctype='multipart/form-data' method='post'><input type='file' name='heading'><Button id='upload'><span class='glyphicon glyphicon-cloud-upload'></span></Button></form><Button id='close'><span class='glyphicon glyphicon-remove'></span></span></Button>";
        document.body.appendChild(con);
        //获取弹出框的高度和宽度,写在插入节点之后
        var dHeight = con.offsetHeight;
        var dWidth = con.offsetWidth;
        con.style.left = (sWidth - dWidth)/2 + "px";
        con.style.top = (sHeight - dHeight)/3 + "px";
        var onClose = document.getElementById("close");
        oMask.onclick=onClose.onclick = function(){
            document.body.removeChild(oMask);
            document.body.removeChild(con);
        }
     };

};